<html xmlns="http://www.w3.org/1999/xhtml"
      xmlns:ui="http://java.sun.com/jsf/facelets"
      xmlns:h="http://java.sun.com/jsf/html"
      xmlns:f="http://java.sun.com/jsf/core">
  <head>
    <title>
      <ui:insert name="title">Default title</ui:insert>
    </title>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"/>
    <link rel="stylesheet" type="text/css"
          href="${facesContext.externalContext.request.contextPath}/style/myfoon.css"/>
    <link rel="stylesheet" type="text/css"
          href="${facesContext.externalContext.request.contextPath}/style/login.css"/>
    <script type="text/javascript">        
        var hints = new Array('#{messages['global.hint.email']}',
                              '#{messages['global.hint.password']}',                              
                              '#{messages['global.hint.name']}');
                              
        var error = new Array('#{messages['global.error.email']}',
                              '#{messages['global.error.password']}',
                              '#{messages['global.error.name']}',
                              '',
                              '#{messages['global.error.dateofbirth']}',
                              '#{messages['global.error.country']}');        
        </script>
    <script type="text/javascript"
            src="${facesContext.externalContext.request.contextPath}/sc/logUtils.js">
        </script>
  </head>
  <body class="">
    <h:form>
    <div class="Login_TopBar">
            <div class="ml"/>
             
            <div class="lng">
                <h:selectOneMenu value="#{view.locale}"                                                 
                                 valueChangeListener="#{locales.valueChange}"
                                 styleClass="formSelectOneChoice"
                                 contentStyle="font-size: 11px;">
                    <f:selectItems value="#{locales.localeItems}"/>
                </h:selectOneMenu>
            </div>
    </div>
    <div class="Login_Content">
            <div class="LeftSide">
                <h:panelGroup layout="block">
                
                    <h:outputText value="#{messages['global.whatismyfoon']}"
                                   styleClass="Foon_sp1"/>
                    <div style="margin: 8px"/>
                    <h:outputText value="#{messages['global.slog1']}"
                                   styleClass="Foon_sp3"/>
                </h:panelGroup>
                                                
                <div style="margin: 15px"/>
                 
                <div class="img1"></div>
                 
                <div class="su">
                    <div class="hint" id="_form_su_err1" style="display: none;">
                        <h:outputText id="_form_su_he_msg"/>                        
                        <div class="pointer"></div>
                    </div>
                     
                     
                    <h:outputText value="#{messages['global.signup']}"
                                   styleClass="Foon_sp2"/>
                     
                    <div style="margin: 5px"/>
                     <!--
                    <tr:panelFormLayout id="_form_su1"
                                        inlineStyle="margin-left: 10px; height: 215px;">
                        <tr:inputText id="_form_su_email"
                                      label="#{messages['global.email']}"
                                      value="#{registrationBean.user.email}"
                                      styleClass="FoonInput_Su"                                      
                                      onfocus="_form_su_validate(1, 1); return false;"/>                                                        
                        <tr:inputText id="_form_su_password"
                                      label="#{messages['global.password']}"
                                      secret="true"
                                      value="#{registrationBean.user.passwd}"
                                      styleClass="FoonInput_Su"
                                      onfocus="_form_su_validate(2, 1); return false;"/>                                                        
                        <tr:inputText id="_form_su_fullname"
                                      label="#{messages['global.fullname']}"
                                      value="#{registrationBean.user.userPi.fullname}"
                                      styleClass="FoonInput_Su"
                                      onfocus="_form_su_validate(3, 1); return false;"/>                                     
                        <div style="margin: 3px"/>
                        <tr:selectOneChoice styleClass="Foon_Su_c"
                                            id="_form_su_gender"
                                            label="#{messages['global.gender']}"
                                            value="#{registrationBean.user.userPi.gender}"
                                            onfocus="_form_su_validate(4, 1); return false;">
                            <f:selectItem itemLabel="#{messages['global.gender.female']}"
                                          itemValue="false"/>
                            <f:selectItem itemLabel="#{messages['global.gender.male']}"
                                          itemValue="true"/>
                        </tr:selectOneChoice>
                        <div style="margin: 3px"/>
                        <tr:panelLabelAndMessage label="#{messages['global.dateofbirth']}"
                                                 labelStyle="color: #146eb4; font-size: 11px; font-family: Tahoma;"
                                                 id="_form_su_dateofbirth">
                            <tr:panelHorizontalLayout halign="left">
                                <tr:selectOneChoice styleClass="Foon_Su_c"
                                                    id="_form_su_month"
                                                    value="#{registrationBean.currentMonth}"
                                                    onfocus="_form_su_validate(5, 1); return false;"
                                                    simple="true">
                                    <f:selectItem itemLabel="#{messages['global.month']}" itemValue="0"/>
                                    <f:selectItems value="#{registrationBean.monthList}"/>                                
                                </tr:selectOneChoice>
                                <tr:selectOneChoice styleClass="Foon_Su_c"
                                                    id="_form_su_day"                                                    
                                                    onfocus="_form_su_validate(5, 1); return false;"
                                                    value="#{registrationBean.currentDay}">                                                    
                                    <f:selectItem itemLabel="#{messages['global.day']}"
                                                  itemValue="0"/>
                                    <f:selectItems value="#{registrationBean.dayList}"/>
                                </tr:selectOneChoice>
                                <tr:selectOneChoice styleClass="Foon_Su_c"
                                                    id="_form_su_year"
                                                    onfocus="_form_su_validate(5, 1); return false;"
                                                    value="#{registrationBean.currentYear}">
                                    <f:selectItem itemLabel="#{messages['global.year']}"
                                                  itemValue="0"/>
                                    <f:selectItems value="#{registrationBean.yearList}"/>
                                </tr:selectOneChoice>
                            </tr:panelHorizontalLayout>
                        </tr:panelLabelAndMessage>
                        <div style="margin: 3px"/>
                        <tr:selectOneChoice label="#{messages['global.country']}"
                                            id="_form_su_country"
                                            value="#{registrationBean.currentCountry}"
                                            onfocus="_form_su_validate(6, 1); return false;"
                                            styleClass="Foon_Su_cc">                                            
                            <f:selectItem itemLabel="#{messages['global.selectcountry']}"
                                          itemValue="0"/>
                            <f:selectItems value="#{registrationBean.countryList}"/>
                        </tr:selectOneChoice>
                        <div style="margin: 5px"/>                        
                        <tr:commandButton text="#{messages['global.register']}"
                                          id="_form_su_reg1btn"                                                                                                                                             
                                          onclick="_form_su_validateAll(); return false;"/>
                        <div style="margin: 3px"/>
                        <tr:outputText inlineStyle="font-family: Tahoma; font-size: 11px;"
                                       id="_form_su_accept"
                                       value="#{messages['global.terms.accept']}"/>
                    </tr:panelFormLayout> -->   
                    <!--
                    <tr:panelFormLayout id="_form_su2"
                                        inlineStyle="margin-left: 10px; display: none; height: 215px;">                                        
                        <tr:outputText inlineStyle="font-family: Tahoma; font-size: 11px; font-weight: bold;"
                                       id="_form_su_type"
                                       value="#{messages['global.verification.type']}"/>
                        <t:captcha id="captchaImage"                                   
                                   imageWidth="180px" imageHeight="55px"
                                   captchaSessionKeyName="#{registrationBean.sessionKey}"/>
                        <div style="margin: 5px"/>
                        <tr:inputText id="_form_su_captchaKey"
                                      label="#{messages['global.verification.code']}"
                                      value="#{registrationBean.captchaKey}"
                                      styleClass="FoonInput_Su"/>
                        <tr:outputText inlineStyle="font-family: Tahoma; font-size: 11px;"
                                       id="_form_su_type"
                                       value="#{messages['global.verification.sensitive']}"/>
                        <div style="margin: 5px"/>
                        <tr:commandButton text="#{messages['global.register']}"
                                          id="_form_su_reg2btn"
                                          action="#{registrationBean.register}"/>                                          
                        <div style="margin: 10px"/>
                        <tr:goLink text="#{messages['global.goback']}"
                                   destination="#" styleClass="FoonGoLink"
                                   onclick="hideCaptcha(); return false;"
                                   inlineStyle="font-size: 11px; color: black; font-weight: normal"/>                        
                    </tr:panelFormLayout> -->
                </div>
            </div>
             
            <div id="RightSide">
                <h:outputText value="#{messages['global.login1']}"
                              styleClass="Foon_sp2"/>                 
                <h:panelGrid style="margin-top: 10px; margin-left: 10px;">                
                    <h:inputText label="#{messages['global.email']}"
                                  styleClass="FoonInput_Lo"
                                  value="#{LoginBean.user.email}"/>
                    <h:inputSecret label="#{messages['global.password']}"
                                   styleClass="FoonInput_Lo"
                                   value="#{LoginBean.user.passwd}"/>
                    <div style="margin: 3px"/>
                    
                    <h:selectBooleanCheckbox  title ="#{messages['global.rememberme']}"
                                              styleClass="FoonCheckBox"/>
                    <div style="margin: 2px"/>
                    <h:commandButton value="#{messages['global.login2']}"                                      
                                    action="#{LoginBean.login}"/>
                    <div style="margin: 3px"/>
                    <h:outputLink title="#{messages['global.forgotpassword']}"
                                  value="#" styleClass="FoonGoLink"
                                  style="font-size: 11px; color: black; font-weight: normal"/>                    
                </h:panelGrid>
            </div>
             
            <div class="btmbar">
                <div class="mf">
                    <h:outputText value="#{messages['global.myfoon']}"
                                  styleClass="Foon_sp5"/>
                </div>
                 
                <div class="ab">
                    <h:panelGroup layout="span">                        
                        <h:outputLink title="#{messages['global.about']}"
                                      styleClass="FoonGoLink"
                                      style="font-weight: normal"
                                      value="/about"/>   
                        <h:outputLink title="#{messages['global.advertise']}"
                                      styleClass="FoonGoLink"
                                      style="font-weight: normal"
                                      value="/advertise"/>   
                        <h:outputLink title="#{messages['global.privacy']}"
                                      styleClass="FoonGoLink"
                                      style="font-weight: normal"
                                      value="/privacy"/>   
                        <h:outputLink title="#{messages['global.help']}"
                                      styleClass="FoonGoLink"
                                      style="font-weight: normal"
                                      value="/help"/>                                                           
                    </h:panelGroup>
                </div>
            </div>
        </div>
    </h:form>
  </body>
</html>
